<%@page import="vo.ChapterVO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="js/httpRequest.js"></script>


<script type="text/javascript">
	var callBack_target =null;
	
	
	function init(){
		
		document.getElementById("addChapter").style.display="none";
		document.getElementById("login").style.display="none";
	}
	
	
	function goAjax(url,param,callBack,method,sync,target){
		init();
		callBAck_target = target;	
		sendRequest(url, param, callBack, method, sync);

	}
	function callBack(){
		if(xhr.readyState ==4 && xhr.status == 200){
			var str = xhr.responseText;
			document.getElementById(callBAck_target).innerHTML=str;
		}
	}
	function viewChapterPaging(i){
		
		if(i=="1"){
			document.getElementById("chapterPagingContent").style.display="block";
			document.getElementById("addChapter").style.display="none";
			goAjax('getChapter.action','nowPage=1',callBack,'post',true,'chapterPagingContent');
		}else{
			goAjax('newestChapter.action','',callBack,'post',true,'addChapter');
			document.getElementById("chapterPagingContent").style.display="none";
			document.getElementById("addChapter").style.display="block";
		}
	}
	
	function addChapter(){
		
		var i = null;
		var f=0;
		
		var param="chapter=";
		
		i = document.addForm.getElementsByTagName("input");
		
		param+=i[1].value;
		for(var k=2;k < 9 ; k++){
			i[k].focus();
			
			var v = i[k].value;
			
			v=v.toNumber();
			
			if(v == ""|| v == null){
				alert("숫자를 다 입력해 주시기 바랍니다");
				return;
			}
			if(v > 45 || v < 0){
				alert("1 ~ 45 사이의 숫자를 입력해 주세요");
				i[k].value="";
				return;
			}
			for(var m=k+1 ; m<9 ; m++){
				if(v == (i[m].value+"")){
					alert("중복된 숫자가 있습니다");
					i[k].value="";
					i[m].value="";
					f=1;
					return;
				}
				if( v > i[m].value && m < 8){
					alert("숫자를 순서대로 입력하세요");
					i[k].value="";
					i[m].value="";
					f=1;
					return;
				}
			}
			if(f==1){
				return;
			}
			param+=("&num"+(k-1)+"="+v);
		}
		goAjax('addChapter.action',param,callBack,'post',true,'chapterPagingContent');
		document.getElementById("chapterPagingTab").firstChild.firstChild.click();
	}
</script>
<style type="text/css">
	div#main{
		width:850px;
		margin: auto;
		
	}
	div#top{
		width: 100%;
	}
	div#center{
	float:left;
	width: 70%;
	border: 0px;
	padding : 0PX 3PX;
	}
	div#right{
	width: 29%;
	border: 0px;
	}
	div#bottom{
	clear:both;
	}
	
	
	
	
	<!--content 안 div-->
	div#advertising{
		width:100%;
		float:left;
		background-color: orange;
	}
	div#chapterPaging{
		width:60%;
		height:184px;
		float:left;
		padding:5px;
		border: 1px solid #d7d7d7;
		
	}
	<!--right 안 div-->
	div#loginForm{
	}
	<!--div#chapterPaging 안에 있는 div-->
	
	
	div#chapterPagingContent, div#addChapter{
          width:98%;
          padding:3px;
          border:1px solid #dedede;
          border-top:none;
          background-color:#efefef;

     }
     .addNumSub,.num,.bonus,.windate{
     	border-left:1px solid #efefef;
     }
     
	div#formula{
	    width:40%;
		background-color: green;
		float:top;
	}
	
	
	div#formula_record{
	    width:100%;
		background-color: yellow;
		clear:both;
	}
	
	<!-- 각 속성들 -->
    .num , .windate , .bonus , .oddNum , .evenNum{
		height:10px;
		text-align: center;
		color: black;
		font:bold 11px 나눔고딕코딩;
		line-height: 15px;
	}
	.num,.bonus,.windate{
		background-color: orange;
	}
	.num{
		width: 8%;
		
	}
	.bonus{
		width: 11%;
	}
	.windate{
		width: 19%;
	}
	.oddNum{
		background-color: #F2F7F9;
	}
	.evenNum{
		background:  #e7e7e7;
	}
	#chapterPagingContent a{
		text-decoration: none;
		color: black;
	}
	<!-- -->
	.caption{
		margin-left:10px;
		font: bold 15px/19px 나눔고딕코딩;
		color: #373964;
	}
	<!--변하는 속성-->
	
	<!-- -->
	    ul#chapterPagingTab{
          width:100%;
          height:22px;
          margin-left:  0px;
          margin-bottom: -1px;
          border-left:1px solid #dedede;
          list-style:none;
          padding: 0px;

     }

     ul#chapterPagingTab li{
          margin-left:0px;
          float:left;
     }
    
     ul#chapterPagingTab li a{
          text-decoration:none;
          color:#a7a7a7;
          text-align:center;
          font: bold 12px/19px sans-serif;
          display:block;
          width:56px;
          height:20px;
          border:1px solid #dedede;
          border-left:none;
          overflow:none;
    
     }
     

     ul#chapterPagingTab li a:hover , ul#mechapterPagingTabnu li a:active , ul#chapterPagingTab li.select{
          border-bottom:2px solid #efeef0;
          background-color:#efefef;
          color:#151515
     }
     
     .addNum,.addNumSub {
	font:bold 11px 나눔고딕코딩;
	text-align: center;
	color: black;
}

.addNumSub {
	background-color: orange;
}

.addNum {
	border-left: 1px solid #efefef;
	background-color: #ffffff;
}

.numIn,.numNone {
	border: 0;
}

.numNone,#chapterIndex,#chapter,#win_date {
	background-color: #dedede;
	color: red;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body onload=" init(),goAjax('getChapter.action','nowPage=1',callBack,'post',true,'chapterPagingContent')">
	<div id=main>
		<div id="top">
			<%@include file="menu/top.jsp" %>
		</div>
		<div id="center">
			<div id="advertising">
				<%@include file="advertising/advertising.jsp" %>
			</div>
			<div id="chapterPaging">
				<ul id="chapterPagingTab">
					<li><a href="javascript:viewChapterPaging('1')">당첨번호</a></li>
					<li><a href="javascript:viewChapterPaging('2')">번호등록</a></li>
				</ul>
				<div id="chapterPagingContent">
					
				</div>
				<div id="addChapter">
					
			    </div>
			</div>
			
			<div id="formula">
			
			</div>
			<div id="formula_record">
				
			</div>
		</div>
		<div id="right">
			<div id="loginForm">
				<%@include file="menu/center/right/loginForm.jsp" %>
			</div>
		</div>
		<div id="bottom">
			<%@include file="menu/bottom.jsp" %>
		</div>
		<div id="mainHidden" >
	
		</div>
		
	</div>
	</body>
</html>